<template>
  <div>
    <a-button v-if="hasPermission('1000')" @click="openPdf(0)">打开自己已填写表单 PDF</a-button>
    <a-button v-if="hasPermission('2000')" @click="openPdf(1)">打开全校社团表单 PDF</a-button>
    <a-button v-if="hasPermission('2000')" @click="openPdf(2)">打开本学院社团表单 PDF</a-button>
    <a-button @click="downloadPdf">下载 PDF</a-button>
    <iframe id="pdfFrame" ref="pdfFrame" width="100%" height="600px" style="display: none"></iframe>
  </div>
</template>
<script lang="ts" setup>
// 权限
import { usePermission } from '/@/hooks/web/usePermission';
import { getToken } from '/@/utils/auth/index';
const { hasPermission } = usePermission();
import { ref } from 'vue';
import axios from 'axios';
// import { func } from 'vue-types';
const pdfFrame: any = ref(null);
let download: number = -1
function openPdf(permission: number) {
  download = permission
  // 获得token
  let tokens: string = getToken() as string;
  // 替换为你的服务器端PDF文件路径
  const pdfUrl = 'http://127.0.0.1:3000/pdf';

  // 使用Axios发送GET请求
  axios
    .get(pdfUrl, {
      responseType: 'arraybuffer',
      params: {
        permission: permission
      },
      headers: {
        'Authorization': tokens,
      },
    })
    .then((response) => {
      // 处理获取到的PDF文件数据
      const blob = new Blob([response.data], { type: 'application/pdf', });
      const url = URL.createObjectURL(blob);
      // 将 iframe 的 src 设置为 PDF 文件的 URL，并显示 iframe
      if (pdfFrame.value) {
        pdfFrame.value.src = url;
        pdfFrame.value.style.display = 'block';
      }
      // 在新窗口中打开PDF文件
      // window.open(url, '_blank');
    })
    .catch((error) => {
      console.error('Error fetching PDF:', error);
    });
}

function downloadPdf() {
  // 替换为你的服务器端PDF文件路径
  const pdfUrl = 'http://127.0.0.1:3000/pdf';
  // 待会这里改成axios组件而非axios原生
  // 使用Axios发送GET请求
  // 发起 GET 请求并下载文件
  axios({
    method: 'get',
    url: pdfUrl,
    responseType: 'blob', // 设置响应数据的类型为二进制数据
    params: {
      download: download
    },
  })
    .then((response) => {
      // 创建一个 Blob 对象
      const blob = new Blob([response.data]);

      // 创建一个下载链接
      const downloadLink = document.createElement('a');
      downloadLink.href = window.URL.createObjectURL(blob);

      // 设置下载链接的属性
      downloadLink.download = '未命名.pdf'; // 你要保存的文件名及扩展名

      // 将下载链接附加到文档中
      document.body.appendChild(downloadLink);

      // 触发点击事件以启动下载
      downloadLink.click();

      // 移除下载链接
      document.body.removeChild(downloadLink);
    })
    .catch((error) => {
      // 处理错误
      console.error(error);
    });
}
</script>
